import {Input, Cascader} from "antd";
import React from "react";
import BaseComponent from "../../../redare/components/BaseComponent";
import BaseAreaPresenter from "../../../.gen/presenter/BaseAreaPresenter";
import {getStorage, saveStorage} from "../../../common/StorageUtils";

export default class Address extends BaseComponent {

  static defaultProps = {
    addressplaceholder: '请输入详细地址（小区、街道、楼栋、门牌号）',
    isbrowsecacheplan: "true" //是否使用浏览器缓存策略
  };

  // 地区数据
  areaData={
    provinceCode: null,
    province: null,
    cityCode: null,
    city: null,
    districtCode: null,
    district: null,
    areaStr:null,
    address: ''
  };

  constructor(props) {
    super(props);
    this.state = {
      options: [],
      defaultValue: [],
      address: ''
    };
    this.presenter = new BaseAreaPresenter(this);
  }

  componentDidMount() {
    this._loadAreaData();
  }

  getData(separator) {
    if( !separator ){
      separator = '';
    }
    let data = this.areaData;
    if( !data ){
      return null;
    }
    let areaStr = data.province;
    let {address} = this.state;

    if(  data.city ){
      areaStr += separator + data.city;
      if( data.district ){
        areaStr += separator + data.district;
      }
      if( address ){
        data.address = address;
        areaStr += separator + address;
      }
    }

    data.areaStr = areaStr;

    return data;
  }

  setData(areaData) {
    if (areaData) {
      this.areaData = {
        "provinceCode": areaData.provinceCode,
        'province': areaData.province,
        "cityCode": areaData.cityCode,
        'city': areaData.city,
        'districtCode': areaData.districtCode,
        'district': areaData.district,
        'address': areaData.address
      };

      // areaData.provinceCode, areaData.cityCode
      let value = [];
      // 省
      if( areaData.provinceCode ){
        value.push(areaData.provinceCode);
        // 市
        if( areaData.cityCode ){
          value.push(areaData.cityCode);
          // 区
          if(areaData.districtCode){
            value.push(areaData.districtCode)
          }
        }
      }
      if( areaData.address ){
        this.setState({address: areaData.address});
      }
      this._handleChange(value)
    }
  }

  resetAreaData() {
    this.areaData = {};
    this.setState({newValue: null})
  }


  render() {
    let {options, newValue} = this.state;

    if ( !options ){
      options=[];
    }

    return (
      <div className={'flex'}>
        <Cascader
          {...this.props}
          value={newValue}
          options={options}
          placeholder="请选择地区"
          showSearch={true}
          onChange={this._handleChange.bind(this)}
          fieldNames={{label: 'areaName', value: 'areaCode', children: 'children'}}
          getPopupContainer={
            triggerNode => triggerNode.parentElement
          }
          style={{width: '317px'}}
        />
        <Input
          placeholder={'请输入'+this.props.addressplaceholder}
          style={{marginLeft: '10px', flex: '1'}}
          value={this.state.address}
          onChange={(e)=>{this._inputChange(e)}}
        />
      </div>
    )
  }


  _handleChange(value, options) {
    if (options && options.length > 0) {
      this.areaData = {
        "provinceCode": options[0].areaCode,
        'province': options[0].areaName,
      };
      if (options.length > 1) {
        this.areaData.cityCode = options[1].areaCode;
        this.areaData.city = options[1].areaName;
      }
      if (options.length > 2) {
        this.areaData.districtCode = options[2].areaCode;
        this.areaData.district = options[2].areaName;
      }
    }


    if( (!value || value.length <= 0 ) && (!options || options.length <=0 )) {
      this.areaData = null;
    }


    if (this.props.onChange) {
      this.props.onChange(value)
    }
    this.setState({
      newValue: value
    });
  }

  _inputChange(e){
    this.setState({address: e.target.value})
    if (this.props.onChange) {
      this.props.onChange()
    }
  }


  _loadAreaData() {

    if( this.props.isbrowsecacheplan === true || this.props.isbrowsecacheplan === 'true' ){
      let data = getStorage("AddressData");
      if( data != null){
        this.setState({options: data})
      }else{
        this.__loadAreaData();
      }
    }else {
      this.__loadAreaData();
    }

  }

  __loadAreaData(){
    this.presenter.findAreaList({}, {},
      (result) => {
        let {data} = result;
        this.setState({options: data});
        if( this.props.isbrowsecacheplan === true || this.props.isbrowsecacheplan === 'true' ){
          saveStorage("AddressData", data);
        }
      })
  }

}
